<template>
  <a-drawer
    title="修改商品"
    :maskClosable="false"
    width=650
    placement="right"
    :closable="false"
    @close="onClose"
    :visible="editVisiable"
    style="height: calc(100% - 55px);overflow: auto;padding-bottom: 53px;">
    <a-form :form="form">
     <!-- <a-form-item label='商品SKU' v-bind="formItemLayout">
        <a-input
                 v-decorator="['maa01',
                   {rules: [
                    { required: true, message: '商品SKU不能为空'},
                    { max: 20, message: '长度不能超过20个字符'}
                  ]}]"/>
      </a-form-item>-->
      <a-form-item label='国家代码' v-bind="formItemLayout">
        <a-input  v-decorator="['maa02']" style="width: 100%"/>
      </a-form-item>
    </a-form>
    <div class="drawer-bootom-button">
      <a-popconfirm title="确定放弃编辑？" @confirm="onClose" okText="确定" cancelText="取消">
        <a-button style="margin-right: .8rem">取消</a-button>
      </a-popconfirm>
      <a-button @click="handleSubmit" type="primary" :loading="loading">提交</a-button>
    </div>
  </a-drawer>
</template>
<script>
  const formItemLayout = {
    labelCol: { span: 3 },
    wrapperCol: { span: 18 }
  }
  export default {
    name: 'EditForm',
    props: {
        editVisiable: {
        default: false
      }
    },
    data () {
      return {
        loading: false,
        formItemLayout,
        form: this.$form.createForm(this),
        goods: {}
      }
    },
    methods: {
      reset () {
        this.loading = false
        this.form.resetFields()
      },
      onClose () {
        this.reset()
        this.$emit('close')
      },
      setFormValues ({...goods}) {
        let fields = ['maa01', 'maa02']
        Object.keys(goods).forEach((key) => {
          if (fields.indexOf(key) !== -1) {
            this.form.getFieldDecorator(key)
            let obj = {}
            obj[key] = goods[key]
            this.form.setFieldsValue(obj)
          }
        })
        this.goods.maa01 = goods.maa01
      },
      handleSubmit () {
        this.form.validateFields((err, values) => {
          if (!err) {
            let goods = this.form.getFieldsValue()
            goods.maa01 = this.goods.maa01
            this.$put('goods', {
              ...goods
            }).then(() => {
              this.reset()
              this.$emit('success')
            }).catch(() => {
              this.loading = false
            })
          }
        })
      }
    }
  }
</script>
